<template>
  <div class="">
    <router-view />
  </div>
</template>

<script>
import moment from 'moment'
import _ from 'lodash'

export default {
  name: '',
  props: {},
  data() {
    return {
      name: '123',
      caleList: []
    }
  },
  created() {
    this.initCale()
  },
  methods: {
    initCale() {
      // let a
      const NOW = moment('2022-01-16')
      const _first = _.cloneDeep(NOW).startOf('month') // 月头
      const _last = _.cloneDeep(NOW).endOf('month') // 月尾

      // 计算本月数据
      const days = NOW.daysInMonth() // 本月天数
      const list = [] // 最终日期列表，存入这个数组
      for (let ii = 0; ii < days; ii++) {
        const dd = _.cloneDeep(_first).add(ii, 'days') // 从月头开始往后推算整月
        list.push({
          date: dd.format('YYYY-MM-DD'),
          sd: dd.format('DD'),
          day: dd.day(), // 星期几
          used: true,
          today: dd.format('YYYY-MM-DD') === NOW.format('YYYY-MM-DD') // 今天
        })
      }

      // 补月头（上个月剩下的几天）
      const lenHead = _first.day() - 1 // 本月第一天是星期几？从而推算月头天数
      for (let ii = 1; ii <= lenHead; ii++) {
        const dddd = _.cloneDeep(_first).add(-ii, 'days')
        list.unshift({
          date: dddd.format('YYYY-MM-DD'),
          sd: dddd.format('DD'),
          day: dddd.day(),
          used: false
        })
      }

      // 补月尾
      const lenTail = 7 - _last.day() // 月尾天数
      for (let ii = 1; ii <= lenTail; ii++) {
        const dddd = _.cloneDeep(_last).add(ii, 'days')
        list.push({
          date: dddd.format('YYYY-MM-DD'),
          sd: dddd.format('DD'),
          day: dddd.day(),
          used: false
        })
      }
      this.caleList = list // caleList是VUE中用于渲染出日历的变量
    }
  },
  computed: {},
  watch: {},
  components: {}
}
</script>

<style lang="less" scoped>
.bighot {
  font: red;
}
</style>
